<template>
	<view>
		<image class="bgImage" src="/static/image/guide/homeBg.png" mode="widthFix"></image>
		<view class="navBox">
			<p>专题</p>
		</view>
		<z-paging ref="paging" refresher-theme-style="white" :show-refresher-update-time="true" v-model="datalist" @query="queryListOne"
			:auto="false">
			<!-- <u-empty slot="empty" icon="/static/image/subscription/emptyBg.png" text="还未监控企业">
					</u-empty> -->
			<!-- 如果希望其他view跟着页面滚动，可以放在z-paging标签内 -->
			<view class="listBox">
				<view class="listItem" v-for="(item,index) in datalist" @click="goRoute('/packageA/pages/dialog/dialog',item)" :key="index">
					<image lazy-load :src="item.image" mode=""></image>
					<view class="title">
						<p>{{item.name}}</p>
						<view>
							<image src="http://cdn.yic3.cn/lawyer/mp-xhs/contract/icon1.png" mode=""></image>
							<p>{{item.viewNum}}</p>
						</view>
					</view>
				</view>
			</view>
		</z-paging>
	</view>
</template>

<script>
	export default {
		data() {
			return {
			datalist:[]
			};
		},
		onReady() {
			this.$refs.paging.reload()
		},
		methods: {
			queryListOne(page, size) {
				if(page == 1) uni.showLoading()
				this.$api.getTopic({
					page,
					size
				}).then(res=>{
					if(page == 1) uni.hideLoading()
					this.$refs.paging.complete(res.data.data.items)
					console.log(res)
				})
			},
			goDialog(e){
				this.goRoute('/packageA/pages/dialog/dialog',e)
			}
		}
	}
</script>

<style lang="scss">
	@import 'specialTopic.scss'
</style>